$(function() {
				//all the menu items
				var $items 		= $('#cc_menu .cc_item');
				//number of menu items
				var cnt_items	= $items.length;
				//if menu is expanded then folded is true
				var folded		= false;
				//timeout to trigger the mouseenter event on the menu items
				var menu_time;
				/**
				bind the mouseenter, mouseleave to each item:
				- shows / hides image and submenu
				bind the click event to the list elements (submenu):
				- hides all items except the clicked one, 
				and shows the content for that item
				*/
				$items.unbind('mouseenter')
					  .bind('mouseenter',m_enter)
				      .unbind('mouseleave')
					  .bind('mouseleave',m_leave)
					  .find('.cc_submenu > ul > li')
					  .bind('click',function(){
					var $li_e = $(this);
						  //if the menu is already folded,
						  //just replace the content
					if(folded){
						hideContent();
						showContent($li_e.attr('class'));
						
					}	
					      else //fold and show the content
						fold($li_e);
						
				});
				
				/**
				mouseenter function for the items
				the timeout is used to prevent this event 
				to trigger if the user moves the mouse with 
				a considerable speed through the menu items
				*/
				function m_enter(){
					var $this 	= $(this);
					clearTimeout(menu_time);
					menu_time 	= setTimeout(function(){
					//img
					$this.find('img').stop().animate({'top':'0px'},400);
					//cc_submenu ul
					$this.find('.cc_submenu > ul').stop().animate({'height':'149px'},400);
					},0);
				}
				
				//mouseleave function for the items
				function m_leave(){
					var $this = $(this);
					clearTimeout(menu_time);
					//img
					$this.find('img').stop().animate({'top':'-600px'},400);
					//cc_submenu ul
					$this.find('.cc_submenu > ul').stop().animate({'height':'0px'},400);
				}
				
				//back to menu button - unfolds the menu
				
				$('#content').find('.cc_back').bind('click',unfold);
				$('#logo').bind('click',unfold);
				$('#privacy').click(function(){
																		 $('.button').animate({'right':'-150px'},400);
																		 $('#cont_privacy').css({display:'block'}).animate({'right':'0px'},400);
																		 $('#cont_privacy > .button').animate({'right':'0'},400);
																		
																		 });
				$('.read_more1').click(function(){
																		 $('.button').animate({'right':'-150px'},400);
																		 $('#cont_read_more1').css({display:'block'}).animate({'right':'0px'},400);
																		 $('#cont_read_more1 > .button').animate({'right':'0'},400);
																		
																		 });
				$('#cont_read_more1').find('.cc_back').click(function(){
																		$('#cont_read_more1').animate({'right':'-920px'},400, function(){$(this).css({display:'none'});});
																		$('.button').animate({'right':'0px'},400);
																		 });
				$('.read_more2').click(function(){
																		 $('.button').animate({'right':'-150px'},400);
																		 $('#cont_read_more2').css({display:'block'}).animate({'right':'0px'},400);
																		 $('#cont_read_more2 > .button').animate({'right':'0'},400);
																		
																		 });
				$('#cont_read_more2').find('.cc_back').click(function(){
																		$('#cont_read_more2').animate({'right':'-920px'},400, function(){$(this).css({display:'none'});});
																		$('.button').animate({'right':'0px'},400);
																		 });
				$('#cont_privacy').find('.cc_back').click(function(){
																		$('#cont_privacy').animate({'right':'-920px'},400, function(){$(this).css({display:'none'});});
																		if (folded) {$('.button').animate({'right':'0px'},400);}
																		 });
				/**
				hides all the menu items except the clicked one
				after that, the content is shown
				*/
				function fold($li_e){
					var $item		= $li_e.closest('.cc_item');
					
					var d = 100;
					var step = 0;
					$items.unbind('mouseenter mouseleave');
					$items.not($item).each(function(){
						var $item = $(this);
						$item.stop().animate({
							'marginLeft':'-184px'
						},d += 200,function(){
							++step;
							if(step == cnt_items-1){
								folded = true;
								showContent($li_e.attr('class'));
							}	
						});
					});
				}
				
				/**
				shows all the menu items 
				also hides any item's image / submenu 
				that might be displayed
				*/
				function unfold(){
					$('#cont_privacy').animate({'right':'-920px'},400)
					$('.button').animate({'right':'-150px'},300);
					$('#cc_content').stop().animate({'left':'-736px'},600, function(){
						var d = 100;
						var step = 0;
					$items.each(function(){
							var $item = $(this);
							$item.find('img')
								 .stop()
								 .animate({'top':'-600px'},200)
								 .andSelf()
								 .find('.cc_submenu > ul')
								 .stop()
								 .animate({'height':'0px'},200);
								 
							$item.stop().animate({
							'marginLeft':'0px'
							},d += 150,function(){
								++step;
								if(step == cnt_items){
									folded = false;
									$items.unbind('mouseenter')
										  .bind('mouseenter',m_enter)
										  .unbind('mouseleave')
										  .bind('mouseleave',m_leave);
									
									hideContent();
								}
							
							}); 
						});
					});
				}
				
				//function to show the content
				function showContent(idx){
					$('#cc_content').stop().animate({'left':'184px'},200,function(){
						$(this).find('.'+idx).fadeIn();
						$('.cc_submenu > ul').animate({'bottom':'-180px'},200);
						$('.button').find('.'+idx).fadeIn();
					$('.button').stop().animate({'right':'0px'},600,function(){
						
					});
					});
					
				}
				
				//function to hide the content
				function hideContent(){
					
					$('#cc_content').find('section').hide();
					$('.button').find('div').hide();
					$('.cc_submenu > ul').animate({'bottom':'-20px'},200);
					
					
				}
				
            });